aboutsummaryrefslogtreecommitdiff
path: root/pages/en/anime/watch/[...info].js
diff options
context:
space:
mode:
Diffstat (limited to 'pages/en/anime/watch/[...info].js')
-rw-r--r--pages/en/anime/watch/[...info].js240
1 files changed, 127 insertions, 113 deletions
diff --git a/pages/en/anime/watch/[...info].js b/pages/en/anime/watch/[...info].js
index c17d9c5..aa0b672 100644
--- a/pages/en/anime/watch/[...info].js
+++ b/pages/en/anime/watch/[...info].js
@@ -4,156 +4,90 @@ import { useEffect, useState } from "react";
import { getServerSession } from "next-auth/next";
import { authOptions } from "../../../api/auth/[...nextauth]";
-import dotenv from "dotenv";
import Navigasi from "../../../../components/home/staticNav";
import PrimarySide from "../../../../components/anime/watch/primarySide";
import SecondarySide from "../../../../components/anime/watch/secondarySide";
-import { GET_MEDIA_USER } from "../../../../queries";
import { createList, createUser, getEpisode } from "../../../../prisma/user";
-// import { updateUser } from "../../../../prisma/user";
export default function Info({
sessions,
- aniId,
watchId,
provider,
epiNumber,
dub,
+ info,
userData,
proxy,
disqus,
}) {
- const [info, setInfo] = useState(null);
const [currentEpisode, setCurrentEpisode] = useState(null);
const [loading, setLoading] = useState(false);
- const [progress, setProgress] = useState(0);
- const [statuses, setStatuses] = useState("CURRENT");
const [artStorage, setArtStorage] = useState(null);
const [episodesList, setepisodesList] = useState();
+ const [mapProviders, setMapProviders] = useState(null);
+
const [onList, setOnList] = useState(false);
+ const [origin, setOrigin] = useState(null);
useEffect(() => {
setLoading(true);
+ setOrigin(window.location.origin);
async function getInfo() {
- const ress = await fetch(`https://graphql.anilist.co`, {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- },
- body: JSON.stringify({
- query: `query ($id: Int) {
- Media (id: $id) {
- id
- idMal
- title {
- romaji
- english
- native
- }
- status
- genres
- episodes
- studios {
- edges {
- node {
- id
- name
- }
- }
- }
- bannerImage
- description
- coverImage {
- extraLarge
- color
- }
- synonyms
-
- }
- }
- `,
- variables: {
- id: aniId,
- },
- }),
- });
- const data = await ress.json();
-
- if (sessions?.user?.name) {
- const response = await fetch("https://graphql.anilist.co/", {
- method: "POST",
- headers: {
- "Content-Type": "application/json",
- },
- body: JSON.stringify({
- query: GET_MEDIA_USER,
- variables: {
- username: sessions?.user?.name,
- },
- }),
- });
-
- const responseData = await response.json();
-
- const prog = responseData?.data?.MediaListCollection;
-
- if (prog && prog.lists.length > 0) {
- const gut = prog.lists
- .flatMap((item) => item.entries)
- .find((item) => item.mediaId === parseInt(aniId));
+ if (info.mediaListEntry) {
+ setOnList(true);
+ }
- if (gut) {
- setProgress(gut.progress);
- setOnList(true);
- }
+ const response = await fetch(
+ `/api/v2/episode/${info.id}?releasing=${
+ info.status === "RELEASING" ? "true" : "false"
+ }${dub ? "&dub=true" : ""}`
+ ).then((res) => res.json());
+ const getMap = response.find((i) => i?.map === true) || response[0];
+ let episodes = response;
- if (gut?.status === "COMPLETED") {
- setStatuses("REPEATING");
- } else if (
- gut?.status === "REPEATING" &&
- gut?.media?.episodes === parseInt(epiNumber)
- ) {
- setStatuses("COMPLETED");
- } else if (gut?.status === "REPEATING") {
- setStatuses("REPEATING");
- } else if (gut?.media?.episodes === parseInt(epiNumber)) {
- setStatuses("COMPLETED");
- } else if (
- gut?.media?.episodes !== null &&
- data?.data?.Media.episodes === parseInt(epiNumber)
- ) {
- setStatuses("COMPLETED");
- setLoading(false);
- }
+ if (getMap) {
+ if (provider === "gogoanime" && !watchId.startsWith("/")) {
+ episodes = episodes.filter((i) => {
+ if (i?.providerId === "gogoanime" && i?.map !== true) {
+ return null;
+ }
+ return i;
+ });
}
- }
-
- setInfo(data.data.Media);
- const response = await fetch(
- `/api/consumet/episode/${aniId}${dub ? `?dub=${dub}` : ""}`
- );
- const episodes = await response.json();
+ setMapProviders(getMap?.episodes);
+ }
if (episodes) {
- const getProvider = episodes.data?.find(
- (i) => i.providerId === provider
+ const getProvider = episodes?.find((i) => i.providerId === provider);
+ const episodeList = dub
+ ? getProvider?.episodes?.filter((x) => x.hasDub === true)
+ : getProvider?.episodes.slice(0, getMap?.episodes.length);
+ const playingData = getMap?.episodes.find(
+ (i) => i.number === Number(epiNumber)
);
+
if (getProvider) {
- setepisodesList(getProvider.episodes);
- const currentEpisode = getProvider.episodes?.find(
+ setepisodesList(episodeList);
+ const currentEpisode = episodeList?.find(
(i) => i.number === parseInt(epiNumber)
);
- const nextEpisode = getProvider.episodes?.find(
+ const nextEpisode = episodeList?.find(
(i) => i.number === parseInt(epiNumber) + 1
);
- const previousEpisode = getProvider.episodes?.find(
+ const previousEpisode = episodeList?.find(
(i) => i.number === parseInt(epiNumber) - 1
);
setCurrentEpisode({
prev: previousEpisode,
- playing: currentEpisode,
+ playing: {
+ id: currentEpisode.id,
+ title: playingData?.title,
+ description: playingData?.description,
+ image: playingData?.image,
+ number: currentEpisode.number,
+ },
next: nextEpisode,
});
} else {
@@ -176,6 +110,36 @@ export default function Info({
<>
<Head>
<title>{info?.title?.romaji || "Retrieving data..."}</title>
+ <meta
+ name="title"
+ data-title-romaji={info?.title?.romaji}
+ data-title-english={info?.title?.english}
+ data-title-native={info?.title?.native}
+ />
+ <meta
+ name="description"
+ content={currentEpisode?.playing?.description || info?.description}
+ />
+ <meta name="twitter:card" content="summary_large_image" />
+ <meta
+ name="twitter:title"
+ content={`Episode ${epiNumber} - ${
+ info.title.romaji || info.title.english
+ }`}
+ />
+ <meta
+ name="twitter:description"
+ content={`${
+ currentEpisode?.playing?.description?.slice(0, 180) ||
+ info?.description?.slice(0, 180)
+ }...`}
+ />
+ <meta
+ name="twitter:image"
+ content={`${origin}/api/og?title=${
+ info.title.romaji || info.title.english
+ }&image=${info.bannerImage || info.coverImage.extraLarge}`}
+ />
</Head>
<Navigasi />
@@ -189,7 +153,6 @@ export default function Info({
epiNumber={epiNumber}
providerId={provider}
watchId={watchId}
- status={statuses}
onList={onList}
proxy={proxy}
disqus={disqus}
@@ -201,10 +164,10 @@ export default function Info({
/>
<SecondarySide
info={info}
+ map={mapProviders}
providerId={provider}
watchId={watchId}
episode={episodesList}
- progress={progress}
artStorage={artStorage}
dub={dub}
/>
@@ -215,9 +178,8 @@ export default function Info({
}
export async function getServerSideProps(context) {
- dotenv.config();
-
const session = await getServerSession(context.req, context.res, authOptions);
+ const accessToken = session?.user?.token || null;
const query = context.query;
if (!query) {
@@ -236,6 +198,57 @@ export async function getServerSideProps(context) {
let userData = null;
+ const ress = await fetch(`https://graphql.anilist.co`, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ ...(accessToken && { Authorization: `Bearer ${accessToken}` }),
+ },
+ body: JSON.stringify({
+ query: `query ($id: Int) {
+ Media (id: $id) {
+ mediaListEntry {
+ progress
+ status
+ customLists
+ repeat
+ }
+ id
+ idMal
+ title {
+ romaji
+ english
+ native
+ }
+ status
+ genres
+ episodes
+ studios {
+ edges {
+ node {
+ id
+ name
+ }
+ }
+ }
+ bannerImage
+ description
+ coverImage {
+ extraLarge
+ color
+ }
+ synonyms
+
+ }
+ }
+ `,
+ variables: {
+ id: aniId,
+ },
+ }),
+ });
+ const data = await ress.json();
+
try {
if (session) {
await createUser(session.user.name);
@@ -264,6 +277,7 @@ export async function getServerSideProps(context) {
epiNumber: epiNumber || null,
dub: dub || null,
userData: userData?.[0] || null,
+ info: data.data.Media || null,
proxy,
disqus,
},
generated by cgit v1.2.3 (git 2.25.1) at 2026-03-11 04:55:08 +0000